<template>
  <el-menu
      default-active="2"
      class="el-menu-vertical-demo"
      background-color="white"
      text-color="#000000"
      active-text-color="#000000">
      <el-menu-item index="2">
        <span slot="title"><b>菜单</b></span>
      </el-menu-item>
      <el-menu-item index="2">
        <a href="#detail" class="link"><span slot="title">详细信息</span></a>
      </el-menu-item>
      <el-menu-item index="2">
        <a href="#atlas" class="link"><span slot="title">关系图</span></a>
      </el-menu-item>
      <el-menu-item index="2">
        <a href="#detail" class="link"><span slot="title">相关列表</span></a>
        <!-- <span slot="title">相关列表</span>   -->
      </el-menu-item>

    </el-menu>  
</template>

<script>
  export default {
    data() {
      return {}
    },
    methods: {
      scrollTo(element){
        console.log(element)
        window.scrollTo({
          top:document.querySelector(`#${element}`).offsetTop,
          behavior:'smooth'
        })
      }

    }
  }
</script>

<style lang="scss">
  .el-menu-vertical-demo {
    height: 100%;
    position: fixed;
    .link{
      text-decoration: none;
      color:black
    }
  }
</style>
